<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv=X-UA-Compatible content="IE=edge,chrome=1">
    <meta content=always name=referrer>
    <link rel="stylesheet" type="text/css" href="__STATIC__/css/style_user.css">
    <script src="__STATIC__/js/jquery-1.8.2.js"></script>
    <title>{if condition="input('uid')"}注册{else/}登录{/if}</title>
    <script>
        $(function(){
            $(".tablist li").click(
                    function(){
                        var a=$(".tablist li").index(this);
                        $(this).addClass("cur");
                        $(this).siblings().removeClass("cur");
                        $(".tabcon>div").eq(a).css({display:"block"});
                        $(".tabcon>div").eq(a).siblings().css({display:"none"});
                        $('#login').find('input').not('.log').val('');
                        $('#registers').find('input').not('.reg').val('');
                    }
            )
        })
    </script>
    <style>
        input[type=button],input[type=text],input[type=password]{-webkit-appearance:none;outline:none}
    </style>
</head>
<body>
<div class="wrap-login">
    <div class="header">
        <img src="__STATIC__/img_user/dl-beijing.png" class="bg">
        <input type="hidden" id="uid" value="{:input('uid','')}" />
        <div class="logo">
            <img src="__STATIC__/img_user/web_logo.png">
            <p><a href="{:url('mobile/user_port/index')}">高原狼【商家端】</a></p>
        </div>
        <div class="tablist">
            <ul>
                <li {if condition="!input('?uid')"}class="cur"{/if}><a href="#">登录</a></li>
                <li {if condition="input('?uid')"}class="cur"{/if} id="register"><a href="#">注册</a></li>
            </ul>
        </div>
    </div>
    <div class="tabcon">
        <!--登录开始-->
        <div id="login" {if condition="!input('?uid')"} class="cur" {/if} >
        <div>
            <form action="" method="post" id="form_1" >
                <div class="text">
                    <label>账号</label><input type="text" name="username" placeholder="账号" nullmsg="账号不能为空" datatype="*" errormsg="" >
                </div>
                <div class="text">
                    <label>密码</label><input type="password" placeholder="密码" name="password" id="pwd1" nullmsg="密码不能为空" datatype="*">
                    <img src="__STATIC__/img_user/dl-mimab.png" id="p_1" onclick="toggle(1)">
                </div>
                <input type="submit" value="登录" id="sub_1" class="submit log">
                <p class="find"><a href="{:url('mobile/user_port/find_pwd')}?flag=shop">找回密码</a></p>
            </form>
        </div>
    </div>
    <!--登陆结束-->
    <!--注册开始-->

    <div id='registers' {if condition="input('?uid')"} class="cur" {/if}  >

            <form onsubmit="return false" action="" method="post" id="form_2">
            <div class="text">
                <label>账号</label><input type="text" placeholder="账号" nullmsg="账号不能为空" name="username" id="un2" datatype="m" errormsg="账号格式不对(应为手机号)">
            </div>
            <input type="hidden" name="invit_id" value="{:input('uid','1')}" />
            <div class="text">
                <label>验证码</label><input type="text" placeholder="验证码" nullmsg="请输入6位验证码" name="yzm" datatype="n6" id="yzm2" errormsg="验证码格式不正确">
                <span><a href="javascript:check_num();" id="yzm_2">获取验证码</a></span>
            </div>
            <div class="text">
                <label>密码</label><input type="password" placeholder="密码 (6到18位)" id="pwd2" datatype="s6-18" name="password" nullmsg="密码不能为空" errormsg="密码格式不正确" >
                <img src="__STATIC__/img_user/dl-mimab.png" id="p_2" onclick="toggle(2)">
            </div>
            <input type="submit" value="注册" class="submit reg" id="sub_2">
            </form>
    </div>
    <!--注册结束-->
    </div>

</div>
{include file="public/src" /}
<script>
    //验证表单元素
    $(function () {
        $.Tipmsg.r = null;
        $.Tipmsg.p = null;
        $.Datatype.n6 = /^\d{6}$/;
        var demo1 = $("#form_1").Validform({
            btnSubmit:'#sub_1',
            tiptype: function (msg) {
                layer.open({content: msg, skin: 'msg', time:2});
            },
            tipSweep: true,
            ajaxPost:true,
            callback:function(t){
                layer.open({content:t.message,skin:'msg',time:3});
                switch (t.code){
                    case 200:   //成功
                    setTimeout(function(){
                        window.location.href = "{:url('mobile/shop_auth/member_shop')}";   //跳转到个人主页
                    },2000);
                    break;
                    case 202:   //等待认证
                    setTimeout(function(){
                        window.location.href = "{:url('mobile/shop_auth/create_wait')}";   //跳转到认证等待页
                    },2000);
                    break;
                    case 203:   //失败
                    setTimeout(function(){
                        window.location.href = "{:url('mobile/shop_auth/create_fail')}";   //跳转到认证失败页
                    },2000);
                    break;
                    case 204:  //去创建店铺
                    setTimeout(function(){
                        window.location.href = "{:url('mobile/shop_auth/create_shop')}";   //跳转到创建店铺页
                    },2000);
                    break;
                }
            }
        });
        demo1.config({
            ajaxpost:{
                error: function () {
                    layer.open({content:'网络繁忙,请重试',skin:'msg',time:2});
                }
            }
        });
        var demo2 = $("#form_2").Validform({
            tiptype: function (msg) {
                layer.open({content: msg, skin: 'msg', time:2});
            },
            btnSubmit:'#sub_2',
            tipSweep: true,
            ajaxPost:true,
            callback:function(t){
                layer.open({content:t.message,skin:'msg',time:3});
                if (t.code == 200){
                    setTimeout(function(){
                        window.location.href = "{:url('mobile/user_info/my_shop_index')}";   //跳转到认证页面
                    },2000);
                }
            }
        });
        demo2.config({
            url:"{:url('mobile/shop_auth/register')}",
            ajaxpost:{
                error: function () {
                    layer.open({content:'网络繁忙,请重试',skin:'msg',time:2});
                }
            }
        });
    });
    //隐藏虚拟键盘

    //切换密码的可视类型
    function toggle(id){
        var type = $('#pwd'+id);
        if (type.prop('type') == 'text'){
            type.prop('type','password');
            $('#p_'+id).prop('src','__STATIC__/img_user/dl-mimab.png');
        }else {
            type.prop('type','text');
            $('#p_'+id).prop('src','__STATIC__/img_user/dl-mima.png');
        }
    }
    //发送验证码
    function check_num(){
        var tel = $("#un2").val();
        if (tel == ''){
            layer.open({content: '请输入注册账号', skin: 'msg', time:2});
            return false;
        }
        if (!(/^1(3|4|5|7|8)\d{9}$/.test(tel))){
            layer.open({content: '账号格式不正确', skin: 'msg', time:2});
            return false;
        }
        if (!check_unique(tel)){
            return false;
        }

        count_down();
        $.ajax({
            url:"{:url('mobile/shop_set/get_code')}",
            dataType:'json',
            type:'post',
            data:{'tel':tel,'act':'reg'},
            success:function(t){
                layer.open({content: t.message,skin:'msg',time:2});
            }
        })
    }
    //验证码倒计时
    function count_down(){
        var num = 60;
        var verif = $('#yzm_2');
        var timer = setInterval(function(){
            verif.text(num+'秒');
            if (num <=60 && num >= 1){
                verif.removeAttr('href');
            }else{
                verif.text('重新获取验证码');
                window.clearInterval(timer);
                verif.attr("href",'javascript:check_num(this.id);');
            }
            num--;
        },1000);
    }
    //检测注册手机号码的唯一性
    function check_unique(tel){
        var flag = true;
        $.ajax({
            url:"{:url('mobile/shop_set/check_bind_tel')}",
            type:'post',
            async:false,
            dateType:'json',
            data:{'tel':tel},
            success:function(t){
                if (t.code != 200){
                    layer.open({content: t.message,skin: 'msg',time:2});
                    flag = false;
                }
            }
        });
        return flag;
    }
</script>
</body>
</html>